<!DOCTYPE HTML>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Wallpaper Documentation</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

        <!-- ===== START CSS ===== -->
        <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,300' rel='stylesheet' type='text/css' />
        <link href="css/bootstrap.css" rel="stylesheet" />
        <link type="text/css" href="css/style.css" rel="stylesheet" />

        <!-- ===== START JAVASCRIPT ===== -->
        <script src="javascript/jquery.js" type="text/javascript"></script>    
        <script src="javascript/bootstrap.js" type="text/javascript" charset="utf-8"></script>
        <script src="javascript/options.js" type="text/javascript" charset="utf-8"></script>
        <!-- Le HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
          <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <!-- ===== END JAVASCRIPT ===== -->
    </head>
    <body>
        <div class="tt_top_line" id="top_section">
            <div class="container">
                <ul class="tt_menu_first">
                    <li><a class="back_top_button" data-target="#section" href="#section"><img src="images/logo_bg.png" /></a>
                        <ul class="tt_menu">
                            <li><a class="back_top_button" data-target="#section" href="#section">Introduction</a></li>
                            <li><a class="back_top_button" data-target="#section1" href="#section1">Modification</a></li>
                            <li><a class="back_top_button" data-target="#section2" href="#section2">CSS and Structure</a></li>
                            <li><a class="back_top_button" data-target="#section3" href="#section3">Credits and Sources</a></li>
                        </ul>
                    </li>
                    <li class="top"><b>Wallpaper HTML Theme</b>  Documentation for version 1.0 by <b>GeoThemes</b></li>
                </ul>

            </div>
        </div>

        <div class="container">
            <div class="tt_content">
                <div class="section" id="section">
                    <h1>Introducing Wallpaper - HTML Theme - shared on weidea.net</h1>
                    <ul class="created">
                        <li><b>Wallpaper</b> - HTML Theme</li>
                        <li><b>Created:</b> 01-10-2014</li>
                        <li><b>By:</b> GeoThemes</li>
                        <li class="last"><b>Email:</b> <a href="mailto:assistwordpress@gmail.com">assistwordpress@gmail.com</a></li>
                    </ul>
                    <div class="terms">
                        <p>This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.</p>

                        <p>This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details.</p>

                        <p>You should have received a copy of the GNU General Public License along with this program. If not, see http://www.gnu.org/licenses/.</p>
                    </div>
                    <div class="clear"></div>
                    <p>Thank you for purchasing our product! We are very glad that you have decided on our HTML theme.</p>

                    <p>The theme is very easy to use and we are here to guide and help you, so please read and follow the instructions and if you have further questions write us a email <a href="mailto:assistwordpress@gmail.com">assistwordpress@gmail.com</a>. This documentation is more of a reference work if you do not know what to do and need a better understanding on how the template is built write us a email.</p>
                </div>


                <div class="section" id="section1">
                    <h1>Modification</h1>
                    <span class="go_top"><a href="#top_section">To the Top</a></span>

                    <p>Wallpaper is a theme for all your needs and it has a lot of features, like stiky menu, (wow.js) animations, countdowns and more.</p>
                    <p><b>It has 36 pages:</b></p>
                    <ul> <!-- .to-right, to-left, .center-me helper class-->
                        <li>index.html - Home v1 Page</li>
                        <li>index-v2.html - Home v2 Page</li>
                        <li>index-v2.html - Home v3 Page</li>    
                        <li>about-us.html - About us page</li>                            
                        <li>blog-2c-rs.html - Blog 2 columns and right sidebar</li>
                        <li>blog-2c-rs.html - Blog 3 columns</li>
                        <li>blog-2c-rs.html - Blog fullwidht</li>
                        <li>blog-2c-rs.html - Blog fullwidht and right sidebar</li>
                        <li>cart.html - Cart page</li>
                        <li>coming-soon.html - Coming soon countdown page</li>
                        <li>post.html - Single Post page</li>
                        <li>error-404.html - Error 404 page</li>
                        <li>contact-v1.html - Contact page v1</li>
                        <li>contact-v2.html - Contact page v2</li>
                        <li>contact-v3.html - Contact page v3</li>
                        <li>contact-v4.html - Contact page v4</li>
                        <li>our-team.html - Our team page</li>
                        <li>services.html - Our services page</li>
                        <li>shortcodes.html - Shortcodes page</li>
                        <li>portfolio-2-col.html - Portfolio 2 columns page</li>
                        <li>portfolio-2-col-no-padding.html - Portfolio 2 columns with no padding page</li>
                        <li>portfolio-2-col-v2.html - Portfolio 2 columns v2 page</li>
                        <li>8 more Portfolio pages ... </li>
                        <li>project-v1.html - Project page v1</li>
                        <li>project-v2.html - Project page v2</li>
                        <li>shop.html - Shop page</li>
                        <li>shop-item.html - Single product page</li>
                        <li>shop-ls.html - Shop with left sidebar</li>
                        <li>shop-rs.html - Shop with right sidebar</li>
                    </ul>
                    <p>A screen of the Home Page:</p>
                    <img src="images/theme_images/theme.jpg" alt="theme" />
                    <br/>
                    <p>All the themes elements like the Testimonial, event, services, skills etc. are all separated DIV-s that can be used on any page you want.</p>
                    <p>The themes includes javascripts files:</p>
                    <ul>
                        <li>modernizr.custom.63321.js</li>
                        <li>jquery-1.10.0.min.js</li>
                        <li>jquery-ui.min.js</li>
                        <li>bootstrap.js</li>
                        <li>placeholder.js</li>
                        <li>imagesloaded.pkgd.min.js</li>
                        <li>masonry.pkgd.js</li>
                        <li>jquery.swipebox.min.js</li>
                        <li>farbtastic/farbtastic.js</li>
                        <li>options.js</li>
                        <li>plugins.js</li>
                    </ul>
                    <br/>
                    <p>The site is made of many sections like header, content, slider, testimonials, our partners and more...</p>
                    <p>As example we have the slider section, the code below:</p>
                    <img src="images/theme_images/section-slider.jpg" alt="theme" />
                    <p>And this is how it look live:</p>
                    <img src="images/theme_images/slider-show.jpg" alt="theme" />
                    <p>And a our-team section, if you want to add more members just copy the code from the "col-md div" the code below:</p>
                    <img src="images/theme_images/section-team.jpg" alt="theme" />
                    <p>The same thing is with all sections, testimonials, partners, blogs, they are all in a section or a div="SECTION-TYPE".</p>
                    <br/><br/>
                    <p>Modify your email here to recive emails from contact form:</p>
                    <img src="images/theme_images/contacts.png" alt="theme" />
                    <br/><br/>
                    <p>To set the time for the countdown you have to open, option.js and in the bottom you will find the configuration of FROM_DATE and DUE_DATE as you see bellow:</p>
                    <img src="images/theme_images/countdown.jpg" alt="theme" />
                </div>

                <div class="section" id="section2">
                    <h1>CSS Files and Structure</h1>
                    <span class="go_top"><a href="#top_section">To the Top</a></span>
                    <p>This theme has been implemented as a responsive layout. The full width of the template is fluid for screen mode, and it still has a boxed version.</p>
                    <p>The <b>CSS file</b> is located in the css folder. The css file is registered and included in the <b>"head"..."/head"</b>. </p>
                    <p>CSS file is very good structured and arranged so you can search very easy: </p>
                    <pre>
/* =========================== START HEADER SECTION ===================== */
.header .container {
    position: fixed;
    z-index: 5;
    padding: 35px 0 0;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 0; 
}
.single-page .header .container {
    position: relative;
    padding: 20px 0;
}
.single-page .header .menu ul {
    padding-top: 10px;
}
.single-page .header .menu ul li:first-child {
    padding-bottom: 10px;
}
.single-page .header .menu i,
.single-page .header .logo a {
    color: #fff;
}
.single-page .header .menu i {
    margin-top: 6px;
}
.header-transform {
    position: fixed;
    width: 100%;
    top: 0;
    background: rgba(0,0,0,0.6);
    z-index: 333;
    left: 0;
    height: 70px;
    right: 0;
}
.header-transform .container {
    padding-top: 15px;
}
.header-transform .menu {
    margin-top: 10px;
}
.logo {
    display: inline-block;
}
.logo a {
    display: block;
    font-size: 40px;
    font-weight: 700;
    line-height: 1em;
    color: #fff;
}
.logo a span {
    letter-spacing: -10px;
    position: relative;
    z-index: 2;
}
.menu {
    float: right;
}
.header-transform .responsive-menu {
    margin: 0;
}
.responsive-menu {
    display: none;
}
.menu>ul {
    display: block;
}
.menu ul li {
    display: inline-block;
    *zoom: 1;
    *display: inline;
    margin: 0 0 0 40px;
}
.menu ul li.no-icon-item a:after,
.menu ul li.no-icon-item a:before {
    content: "" !important;
    display: none;
}
.menu ul li a {
    display: block;
    position: relative;
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 13px;
}
.menu ul li a::first-letter {
    color: red;
}
/* =========================== END HEADER SECTION ===================== */

                    </pre>
                </div>

                <div class="section" id="section3">
                    <h1>Credits and Sources</h1>                   
                    <span class="go_top"><a href="#top_section">To the Top</a></span>
                    <p>I've used the following images, icons, fonts or other files as listed.</p>
                    <ul>
                        <li>"Wallpaper Preview" has images from <a href="http://flicker.com" target="_blank">flicker.com</a> and <a href="http://unsplash.com/">unsplash.com</a>.</li>
                        <li><a href="http://www.istockphoto.com/" target="_blank">istockphoto.com/</a>.</li>
                        <li>Icons by <a href="http://www.iconfinder.com" target="_blank">Icon Finder</a></li>
                    </ul>
                    <p><b>Fonts used:</b></p>
                    <ul>
                        <li>Open Sans <a href="http://www.google.com/fonts" target="_blank">Google Web Fonts</a></li>
                    </ul>

                </div>
                <div class="thx">
                    <p>
                        <b>Thank you</b> so much for choosing <b>"Wallpaper"</b> we hope you will enjoy using it!
                    </p>
                </div>

            </div>
            <div class="clear"></div>            
        </div>
    </body>
</html>